@extends('wap.layouts.master')
@section('title','约战服务')

@section('pagecss')
<!--Swiper Css-->
<link rel="stylesheet" href="/library/swiper/swiper-4.1.0.min.css">
@endsection


@section('content')

<div class="aw-main aw-match aw-match-index">
	<!--tab菜单-开始-->
	<div class="aw-bg-fff aw-assest-tab">
		<ul class="aw-tab-list">
			<li class="aw-tab-li hover"><a href="/wap/match/challenge-list">应战</a></li>
			<li class="aw-tab-li"><a href="/wap/match/add-list">发布</a></li>
		</ul>
	</div>
	<!--tab菜单-结束-->
	<!--条件筛选-开始-->
	<div class="aw-mt10"></div>
	<vue-select :form="form" :list_store="list_store" :list_type="list_type" :list_time="list_time"></vue-select>
	<!--条件筛选-结束-->
	<!--日期选择-开始-->
	<vue-date :today="form.today"></vue-date>
	<!--日期选择-结束-->
	<!--列表-开始-->
	<ul class="aw-assest-list aw-index-list">
		<li class="aw-bg-fff aw-list-li aw-index-li" v-for="(list,key) in list_page" v-if="list_page.length>0">
			<div class="aw-li-title aw-index-title">
				<div class="aw-title-left">@{{list.day}}&nbsp;&nbsp;@{{list.time}}</div>
				<div class="aw-title-right">@{{list.address.storefront_name}}<span>｜</span>@{{list.address.type_text}} (@{{list.address.number}}号)</div>
			</div>
			<div class="aw-li-desc">
				<div class="aw-li-desc-zhandui">
					<div class="aw-desc-zhandui-img"><img :src="list.team_info.img ? list.team_info.img : '/img/default_160_160.png'" onerror="javascript:this.src='/img/default_160_160.png';"></div>
					<p>@{{list.team_info.name}}</p>
				</div>
				<div class="aw-li-desc-money">
					<div class="aw-desc-money-kuang">
						<p class="aw-color-2 aw-bold">￥@{{list.money}}</p>
						<p>约战价格</p>
					</div>
					<div class="aw-desc-money-btn"><a v-on:click="Click_Info(list.id,key)" href="javascript:;" class="aw-assest-btn aw-btn-bgcolor-lvse aw-btn-radius aw-btn-height30">我要应战</a></div>
				</div>
				<p class="aw-color-FF5450 aw-li-desc-vs">VS</p>
			</div>
		</li>
	</ul>
	<vue-loding :info_page="info_page"></vue-loding>
	<!--列表-结束-->
</div>

<!--底部导航-开始-->
@include('wap.layouts.nav_booking')
<!--底部导航-结束-->

@section('pagejs')
@parent
<!--Swiper JS-->
<script type="text/javascript" src="/library/swiper/swiper-4.1.0.min.js"></script>

<script type="text/javascript" src="/wap/js/vue-select.js"></script>
<script type="text/javascript" src="/wap/js/vue-date.js"></script>
<script type="text/javascript" src="/wap/js/vue-loding.js"></script>
<script type="text/javascript">
	$('#aw-icon-nav-challenge').addClass('hover');
var MJS_URLArry=URLArry;
var Vue_Data={
	list_store:{},//获取门店列表
	list_type:{},//获取场地类型列表 1
	list_time:{},//获取比赛时段列表
	list_page:{},//获取场地列表 1
	info_page:{count:0,page:1,tips:'应战'},
	form:{store_id:0,type:0,time:0,day:DateToday(),today:1},//请求参数
};
var Get_form=Vue_Data.form;
//获取门店列表
var AD_list_store={
	api:'/api/storefront/list',
	form_data:{page_num:100},
	tips:false,
}
getData(AD_list_store,function(ajax_data){
	Vue_Data.list_store=ajax_data.list;
})
//获取场地类型列表
var AD_list_type={
	api:'/api/storefront/fields',
	form_data:{store_id:Get_form.store_id,page_num:100},
	tips:false,
}
function Get_Refresh_Type_List(){
	getData(AD_list_type,function(ajax_data){
		Vue_Data.list_type=ajax_data.list;
	})
}
Get_Refresh_Type_List()
//获取比赛时段列表
var AD_list_time={
	api:'/api/field/time-list',
	form_data:{},
	tips:false,
}
getData(AD_list_time,function(ajax_data){
	Vue_Data.list_time=ajax_data;
})
//获取应站列表
var AD_list_page={
	api:'/api/team/game-list',
	form_data:{store_id:Get_form.store_id,type:Get_form.type,day:Get_form.day,start_time:''},
	tips:false,
}
Get_Refresh_Page_List()
var is_watch;
vm=new Vue({
	el:'#Vue-body',
	data:Vue_Data,
	components:{
		'vue-select':V_Assest_select,
		'vue-date':V_Assest_date,
		'vue-loding':V_Assest_loding,
	},methods:{
		Get_List_Data:function(push){
			//更新数据
			$.extend(AD_list_page.form_data,this.form);
			Get_Refresh_Page_List(push)
		},Click_Info:function(id,key){
			var date_dom=$('.aw-assest-time ul li').eq(this.form.today - 1)
			var Push_data={}
			Push_data.date_info={
				year:date_dom.attr('data-year'),
				month:date_dom.attr('data-month'),
				day:date_dom.attr('data-day'),
				week:date_dom.attr('data-week'),
			};
			Push_data.day=this.form.day;
			var time_val=$('#time').val()
			if(time_val>0){
				Push_data.is_start_time=this.list_time[this.form.today+1].start_time;
			}
			this.info_selected=Push_data;
			Post_Browser_Cache('date',this.info_selected)
			location.href='/wap/match/challenge?invite_id='+id;
		}
	}
})
Swiper_Date();
</script>
@endsection

@endsection

